/* This applies to all elements (bad practice) */
* {
	color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-weight: 900;
	user-select: none; /* supported by Chrome and Opera */
   -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */
}

@font-face {
    font-family: 'digital-7regular';
    src: url('digital-7.regular-webfont.woff2') format('woff2'),
         url('digital-7.regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body{
	background: url(./img/bg.png);
    background-size: 100% 100%;
}

#radio{
	background: url(./img/radio.png);
    background-size: 100% 100%;
    height: 520px;
    width: 880px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#playCustom{
    position: absolute;
    height: 201px;
    width: 656px;
    top: 119px;
    left: 137px;
}

#playCustom p{
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    text-align: center;
    font-size: 21px;
}

#playSong{
    font-size: 44px;
    position: absolute;
    top: 136px;
    left: 304px;
}

#playSong:hover{
	color: #ff7878;
	cursor: pointer;
}

#playCustom input{
    color: black;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    position: absolute;
    top: 188px;
    width: 330px;
    left: 160px;
    text-align: center;
    border: solid 3px;
    border-radius: 5px;
}

#time{
    position: absolute;
    top: 60px;
    right: 392px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 20px;
}

#useless{
    position: absolute;
    top: 60px;
    right: 99px;
    font-size: 20px;
	display: flex;
}

#AddName {
	text-align: center;
	color: black;
}
#AddUrl{
    text-align: center;
    color: black;
}

#editSong p{
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 20px;
	text-align: center;
}

#editSong span{
	font-size: 45px;
    position: relative;
    top: 15px;
    left: 60px;
}

#editSong span:hover{
	color: #30f96e;
	cursor: pointer;
}

#editSong{
    position: absolute;
    height: 193px;
    width: 179px;
    top: 17px;
    left: 44px;
    right: 0;
    bottom: 82px;
    margin: auto;
}

#menu{
    height: 63px;
    width: 661px;
    position: absolute;
    bottom: 92px;
    right: 84px;
}

#musicList{
    height: 272px;
    width: 657px;
    position: absolute;
    top: 92px;
    left: 137px;
}

.music{
    height: 137px;
    width: 219px;
    float: left;
    text-align: center;
    font-size: 31px;
    display: block;
    padding: 25px;
}

.music p{
    font-size: 16px;
    position: relative;
    top: 14px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    text-decoration: underline;
    height: 27px;
    text-overflow: ellipsis;
    overflow: hidden;
    height: 45px;
}

.music i:hover{
	color: #ff7878;
	cursor: pointer;
}

.music span{
    color: white;
    position: relative;
    top: 3px;
}

.music span:hover{
	color: #30f96e;
	cursor: pointer;
}


.box{
    height: 63px;
	width: 132px;
    float: left;
    text-align: center;
    font-size: 31px;
    display: flex;
    justify-content: center;
    align-items: center;	
}

.box:hover{
	/* background: url(./img/menu_activate.png) repeat; */
	color: #ff7878;
	cursor: pointer;
}

.box:hover i{
	color: #ff7878;
	cursor: pointer;
}